<template>
    <div class="distributor-article-list">
      <div class="common-header-wrap">
        <mt-header :title="article_title" class="common-header">
          <mt-button slot="left" icon="back" @click="$router.go(-1)"></mt-button>
        </mt-header>
      </div>
      <div class="content" v-html='article_content'></div>
      <header-more class="asl" :showDot="showDot"></header-more>
    </div>
</template>
<script>
import { getArticleDetail } from '../../../api/homeArticle'
import { Toast } from 'mint-ui'
import HeaderMore from '../..//HeaderMore'
export default {

  name: 'HomeDocument',
  data () {
    return {
      article_title: '',
      article_content: '',
      showDot:false,
    }
  },
  components:{
    HeaderMore
  },
  created: function () {
    let article_id = this.$route.query.article_id
    getArticleDetail(article_id).then(res => {
      console.log(11111)
      this.article_title = res.result.article_title
      this.article_content = res.result.article_content
      const regex = new RegExp('<img', 'gi')
      this.article_content = res.result.article_content.replace(regex, `<img style="max-width: 100%; height: auto"`)
    }).catch(function (error) {
      Toast(error.message)
    })
  }

}
</script>
<style  lang="scss" scoped>
.asl{
  // display: none;
  opacity:0
}
.content{padding:.5rem;font-size:.7rem;line-height:1rem;}
</style>
